import React from 'react';

import { Table, Space, Form, } from 'antd';
import { PlusOutlined } from '@ant-design/icons';

function MyTable(props) {

    const columns = [
        {
            title: '操作类型',
            dataIndex: 'id',
        },
        {
            title: '名称',
            dataIndex: 'name',
        },
        {
            title: '描述',
            dataIndex: 'status',
        },
    ];

    return <Form component={false}>
        <Table
            dataSource={props.data}
            columns={[...(!props.columns ? columns : props.columns), {
                title: <>
                    <span>操作</span>
                    <a style={{ marginLeft: '10px' }}
                        onClick={() => { console.log('操作的+号'); }}>
                        <PlusOutlined />
                    </a>
                </>,
                dataIndex: 'operation',
                render: (text, record) => (
                    <Space size="middle">
                        <a onClick={() => { props.handleEdit(record) }}>编辑</a>
                        <a onClick={() => { props.handleDelete(record) }}>删除</a>
                    </Space>
                ),
            }]}
            rowClassName="editable-row"
        />
    </Form>;
}

export default MyTable